html,
body,
#app {
  height: 100vh;
  width: 100vw;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

html.dark {
  background-color: #121212;
}

/** 滑动块样式 */
::-webkit-scrollbar {
  width: 4px;
}

::-webkit-scrollbar:horizontal {
  height: 4px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-corner {
  background: transparent !important;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: var(--primary-color);
  border-radius: 10px;
}

/** 页面切换动画 - fade-slide */
.fade-slide-leave-active,
.fade-slide-enter-active {
  transition: all 0.3s;
}

.fade-slide-enter-from {
  opacity: 0;
  transform: translateX(-30px);
}

.fade-slide-leave-to {
  opacity: 0;
  transform: translateX(30px);
}

/* English */

@font-face {
  font-family: "CMU Sans Serif";
  font-style: normal;
  font-weight: normal;
  src: url("~/assets/fonts/cmu-sans-serif/regular.ttf") format("opentype");
}

@font-face {
  font-family: "CMU Sans Serif";
  font-style: normal;
  font-weight: bold;
  src: url("~/assets/fonts/cmu-sans-serif/bold.ttf") format("opentype");
}

@font-face {
  font-family: "CMU Sans Serif";
  font-style: italic;
  font-weight: normal;
  src: url("~/assets/fonts/cmu-sans-serif/italic.ttf") format("opentype");
}

@font-face {
  font-family: "CMU Sans Serif";
  font-style: italic;
  font-weight: bold;
  src: url("~/assets/fonts/cmu-sans-serif/bolditalic.ttf") format("opentype");
}

/* Chinese */

@font-face {
  font-family: "HKST";
  font-style: normal;
  font-weight: normal;
  src: url("~/assets/fonts/hkst/w7.ttf") format("opentype");
}

@font-face {
  font-family: "HKST";
  font-style: normal;
  font-weight: bold;
  src: url("~/assets/fonts/hkst/w9.ttf") format("opentype");
}

@font-face {
  font-family: "mainfont";
  src: url("~/assets/fonts/mainfont.otf");
  font-weight: normal;
  font-style: normal;
}

/* arabic */
@font-face {
  font-family: "Changa";
  font-style: normal;
  font-weight: 600;
  src: local("Changa SemiBold"), local("Changa-SemiBold"), url("~/assets/fonts/changa/changa-arabic.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+FB50-FDFF, U+FE80-FEFC;
}

/* latin-ext */
@font-face {
  font-family: "Changa";
  font-style: normal;
  font-weight: 600;
  src: local("Changa SemiBold"), local("Changa-SemiBold"), url("~/assets/fonts/changa/changa-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: "Changa";
  font-style: normal;
  font-weight: 600;
  src: local("Changa SemiBold"), local("Changa-SemiBold"), url("~/assets/fonts/changa/changa-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}
